<template>
	<view class="pages">
		<view>
			<view class="btnTop">隐患详情</view>
		</view>
		<view class="card-list">
			<view class="card-list-cell" v-for="(item,index) in detail" :key='index'>
				<view class="card-title">
					<text>{{item.title}}</text>
				</view>
				<view class="card-cont">
					<view>
						<view class="card-text">
							<view class="card-text-lable">
								<text>隐患描述：</text>
							</view>
							<view class="card-text-cont">
								<text>{{item.description}}</text>
							</view>
						</view>
						<view class="card-text">
							<view class="card-text-lable">
								<text>风险区域：</text>
							</view>
							<view class="card-text-cont">
								<text>{{item.position}}</text>
							</view>
						</view>
						<view class="card-text">
							<view class="card-text-lable">
								<text>整改责任人：</text>
							</view>
							<view class="card-text-cont">
								<text>{{u_name}}</text>
							</view>
						</view>
					</view>
					<!-- is_checked -->
					<view class="card-image">
						<image v-if="item.is_checked" src="../../static/cut/loginHT.png" mode=""></image>
						<text v-if="item.is_checked">已验收</text>
					</view>
				</view>
			</view>
			
			
		</view>
	</view>
</template>

<script>
	
		import uniCollapse from '@/components/uni-collapse/uni-collapse.vue'
		import uniCollapseItem from '@/components/uni-collapse-item/uni-collapse-item.vue'
		export default {
			components: {
				uniCollapse,
				uniCollapseItem
			},
			data() {
				return {
					accordion: [
						{
							id: 0,
							title: '标题文字',
							content: '手风琴效果',
							animation: true
						}
					],
					id: 2,
					detail:[],
					u_name:'',
				}
			},
			onLoad(option) {
				this.detail = JSON.parse(option.item)
				this.u_name = option.u_name
			},
			methods: {
				change(e) {
					//console.log(e)
				}
			}
		}
</script>

<style>
	.btnTop{
		background:#2892ff;
		padding: 5upx 10upx;
		display: inline-block;
		border-radius:10upx;
		margin-top: 20upx;
		margin-left: 40upx;
		color:#FFFFFF;
	}
	.card-list{padding: 30upx;}
	.card-list-cell{padding: 20upx 40upx 30upx;border-radius: 13upx;background-color: #FFFFFF;}
	.card-list-cell:nth-child(n+2){margin-top: 30upx;}
	.card-title{font-size: 36upx;color: #221815;font-weight: bold;}
	.card-cont{display: flex;flex-direction: row;justify-content: space-between;}
	.card-text{font-size: 48upx;line-height: 76upx;color: #666666;margin-top:20upx;flex: 1; display: flex;flex-direction: row;justify-content: flex-start;}
	.card-text-lable{white-space: nowrap;}
	.card-text-cont{flex: 1;word-break:break-all;}
	.card-image{width: 200upx;display: flex;flex-direction: column;justify-content: center; margin-left:10upx;text-align: center;}
	.card-image image{
		width: 200upx;
		height: 200upx;
	}
	.card-image text{
		color:#2892FF;
		font-size:45upx;
		margin-top:19upx;
	}
	
</style>
